import React,{useState,useReducer,useEffect,useRef} from "react";

const initState = (initialCount)=>({count:initialCount})
function reducer(stata,action) {
    switch (action.type) {
        case "increment":
            return {count:stata.count+1};
        case "decrement":
            return {count:stata.count-1};
        case "reset":
            return initState(action.reload)
        default:
            throw new Error("未匹配到值")
    }
}

let initialCount = 0;
function Counter() {
    const refContainer = useRef("lgz");
    console.log(refContainer);
    const [state,dispatch] = useReducer(reducer,initialCount,initState);
    useEffect(()=>{
        console.log(refContainer)
        refContainer.current.innerHTML = "lg18"
    });
    return (
        <>
            Count:{state.count}
            <div ref={refContainer}></div>
            <button onClick={() => dispatch({type: 'reset',reload:initialCount})}>reset</button>
            <button onClick={() => dispatch({type: 'decrement'})}>-</button>
            <button onClick={() => dispatch({type: 'increment'})}>+</button>
        </>
    )
}
export default Counter
